<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
		<!--[if lt IE 9]>
    		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->
		<link rel="stylesheet" type="text/css" href="style.css" />
		<!--[if lte IE 7]>
        	<link rel="stylesheet" href="style_ie.css" />
        <![endif]-->
        <link rel="stylesheet" type="text/css" href="menutop/menutop.css" />
		<script src="menutop/stuHover.js" type="text/javascript"></script>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
		<script src="galleria/galleria-1.2.9.js"></script>
        <title>Test Loufelibre</title>
    </head>
    <body>
	<div id="pageContainer">
	<header>
		<img src="img/header.png" alt="header"/>
	</header>
	<nav>
		<ul id="nav">
			<li class="top"><a href="#nogo1" class="top_link"><span>Home</span></a></li>
			<li class="top"><a href="#nogo2" id="products" class="top_link"><span class="down">Products</span></a>
				<ul class="sub">
					<li><a href="#nogo3" class="fly">Cameras</a>
							<ul>
								<li><a href="#nogo4">Nikon</a></li>
								<li><a href="#nogo5">Minolta</a></li>
								<li><a href="#nogo6">Pentax</a></li>
							</ul>
					</li>
					<li class="mid"><a href="#nogo7" class="fly">Lenses</a>
							<ul>
								<li><a href="#nogo8">Wide Angle</a></li>
								<li><a href="#nogo9">Standard</a></li>
								<li><a href="#nogo10">Telephoto</a></li>
								<li><a href="#nogo11" class="fly">Zoom</a>
									<ul>
										<li><a href="#nogo12">35mm to 125mm</a></li>
										<li><a href="#nogo13">50mm to 250mm</a></li>
										<li><a href="#nogo14">125mm to 500mm</a></li>
									</ul>
								</li>
								<li><a href="#nogo15">Mirror</a></li>
								<li><a href="#nogo16" class="fly">Non standard</a>
									<ul>
										<li><a href="#nogo17">Bayonet mount</a></li>
										<li><a href="#nogo18">Screw mount</a></li>
									</ul>
								</li>
							</ul>
					</li>
					<li><a href="#nogo19">Flash Guns</a></li>
					<li><a href="#nogo20">Tripods</a></li>
					<li><a href="#nogo21">Filters</a></li>
				</ul>
			</li>
			<li class="top"><a href="#nogo22" id="services" class="top_link"><span class="down">Services</span></a>
				<ul class="sub">
					<li><a href="#nogo23">Printing</a></li>
					<li><a href="#nogo24">Photo Framing</a></li>
					<li><a href="#nogo25">Retouching</a></li>
					<li><a href="#nogo26">Archiving</a></li>
				</ul>
			</li>
			<li class="top"><a href="#nogo27" id="contacts" class="top_link"><span class="down">Contacts</span></a>
				<ul class="sub">
					<li><a href="#nogo28">Support</a></li>
					<li><a href="#nogo29" class="fly">Sales</a>
						<ul>
							<li><a href="#nogo30">USA</a></li>
							<li><a href="#nogo31">Canadian</a></li>
							<li><a href="#nogo32">South American</a></li>
							<li><a href="#nogo33" class="fly">European</a>
								<ul>
									<li><a href="#nogo34" class="fly">British</a>
										<ul>
											<li><a href="#nogo35">London</a></li>
											<li><a href="#nogo36">Liverpool</a></li>
											<li><a href="#nogo37">Glasgow</a></li>
											<li><a href="#nogo38" class="fly">Bristol</a>
												<ul>
													<li><a href="#nogo39">Redland</a></li>
													<li><a href="#nogo40">Hanham</a></li>
													<li><a href="#nogo41">Eastville</a></li>
												</ul>
											</li>
											<li><a href="#nogo42">Cardiff</a></li>
											<li><a href="#nogo43">Belfast</a></li>
										</ul>
									</li>
									<li><a href="#nogo44">French</a></li>
									<li><a href="#nogo45">German</a></li>
									<li><a href="#nogo46">Spanish</a></li>
								</ul>
							</li>
							<li><a href="#nogo47">Australian</a></li>
							<li><a href="#nogo48">Asian</a></li>
						</ul>
					</li>
					<li><a href="#nogo49">Buying</a></li>
					<li><a href="#nogo50">Photographers</a></li>
					<li><a href="#nogo51">Stockist</a></li>
					<li><a href="#nogo52">General</a></li>
				</ul>
			</li>
			<li class="top"><a href="#nogo53" id="shop" class="top_link"><span class="down">Shop</span></a>
				<ul class="sub">
					<li><a href="#nogo54">Online</a></li>
					<li><a href="#nogo55">Catalogue</a></li>
					<li><a href="#nogo56">Mail Order</a></li>
				</ul>
			</li>
			<li class="top"><a href="#nogo57" id="privacy" class="top_link"><span>Privacy Policy</span></a></li>
		</ul>
	</nav>
	<section>
		<article>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec metus velit. Mauris posuere tristique velit at pulvinar. Aliquam ullamcorper sapien odio, id viverra ligula. Nullam sodales tempor magna, non mollis erat condimentum eget. Proin vitae turpis velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut imperdiet dui in sem elementum laoreet.

Vivamus nisl neque, tempor ac mollis nec, aliquet id tellus. Etiam ultrices libero nec nisi vulputate vehicula. Suspendisse ultricies turpis erat, sit amet viverra purus. Etiam vulputate pharetra erat sed imperdiet. Sed rhoncus, mi vitae feugiat interdum, tellus erat molestie ligula, non faucibus lorem risus ac enim. Sed sed nisi felis, vel eleifend ante. In malesuada dui in justo facilisis sagittis. Donec sed nulla et nisl ullamcorper convallis eget quis ante. Vestibulum non dui a lectus rhoncus tincidunt eu id nulla. Mauris interdum tincidunt sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur et felis id leo adipiscing ullamcorper quis vitae ante.

Quisque leo turpis, ultrices vel porta et, elementum quis orci. Nam et velit sed nunc cursus laoreet. Quisque pellentesque placerat augue, vitae adipiscing metus vestibulum et. Fusce gravida euismod leo non ornare. Duis ut justo libero, laoreet tincidunt ligula. Phasellus volutpat magna non mi scelerisque bibendum. Curabitur egestas consectetur tincidunt. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras diam ante, adipiscing non suscipit vitae, placerat ut orci. Mauris egestas felis eget nisl imperdiet non vehicula dolor bibendum.
		</article><!--
	 --><aside>
	 	<div id="galleria">
	 		<img src="img/paysage.jpg" alt="image" data-title="Paysage" data-description="Random"/>
			<img src="img/image.gif" alt="image" data-title="Sapin de noël" data-description="Image gif bidon trouvée en 10 secondes sur Google Images. Le choix est évidemment discutable dans ce contexte."/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<img src="img/image.gif" alt="image" data-title="My title" data-description="My description"/>
			<script>
   	 			Galleria.loadTheme('galleria/themes/classic2/galleria.classic.js');
   	 			Galleria.configure({
   	 				overlayBackground: "#8ED492",
    				lightbox: true,
    				imageCrop: false,
    				show_info: true,
    				showCounter: true,
    				_toggleInfo: false
				});
   	 			Galleria.run('#galleria');
   	 		</script>
   	 	</div>
		</aside>
	</section>
	<footer>
		<img src="img/info.png" alt="contact" /><img class="spacer" src="img/spacer.png" alt=""/><img src="img/mail.png" alt="mail" />
	</footer> 
	</div>   
    </body>
</html>
